<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>购物车</title>
    <link rel="stylesheet" href="/lib/font/iconfont.css">
    <link rel="stylesheet" href="/lib/font1/iconfont.css">
    <link rel="stylesheet" href="/css/cart.css">
    <link rel="stylesheet" href="/css/reset.css">
    <link rel="stylesheet" href="/lib/swiper-master/swiper-bundle.min.css">
</head>

<body>
  <header>

  </header>

    <!-- body-main -->
    <!-- tou -->
    <div id="ct-t">
        <div class="cts-t">
            <ul>
                <li>
                    <a href="/index.html">首页 > </a>
                </li>

                <li>
                    <a href="">我的购物车 </a>
                </li>
            </ul>
        </div>
    </div>

    <!-- biao -->
    <div id="ct-b">
        <div class="ct-bc">
            <table>
                <thead>
                    <tr>
                        <th>
                            <em class="check checkAll active"></em>全选
                        </th>
                        <th>商品名称</th>
                        <th>数量</th>
                        <th>价格</th>
                        <th>操作</th>
                    </tr>
                </thead>
                <tfoot>
                   <tr>
                    <td>
                        <em class="check active checkAll"></em>全选
                    </td>
                    <td>删除选中商品  继续购物 </td>
                    <td>共
                        <span id="sum_count">0</span>
                        件商品，
                    </td>
                    <td>合计:
                        <span1>￥<b id="sum_price">0</b> </span1>
                    </td>
                    <td>
                        <p><a href="">去结算</a></p>
                    </td>
                </tr>
                </tfoot>
                <tbody>
               
                </tbody>
            </table>          

<!-- 定义购物车页面body模板 -->
<script type="text/html" id="cartTemplate">
 {{each list item}}
 <tr prodId="{{item.id}}">
        <td>
            <em class="check {{item.checked ? 'active' : ''}} over"></em>
        </td>
        <td>
            <img src="{{item.image}}" alt="">
            <span>{{item.title}}</span>
        </td>
        <td>
          
                <div class="count1">
                    <div class="cart_left">
                        <a href="">-</a>
                    </div>
                    <div>
                        <input type="text" value="{{item.count}}"  class="cart_mid">
                    </div>
                    <div class="cart_right">
                        <a href="">+</a>
                    </div>
                </div>
           
            <span>库存84件</span>
        </td>
        <td>￥{{item.price}}</td>
        <td class="del">x</td>
    </tr>

 {{/each}}


</script>

        </div>
    </div>

    <!-- swiper -->
    <div id="ct-f">
     <div class="ct-fc">
             <p>猜你喜欢</p>
     <div class="ct-sp">
        <div class="spw"> 
        <div class="swiper-container spw-tu">
         <div class="swiper-wrapper ul">
          <div class="swiper-slide li">
         <img src="/images/WMSC/a917a3be22b9471a83e34c58df61f375_120.jpg" alt="">
        <p>诛仙3-纯银镀金合欢铃</p>
        <span>￥239.00</span>
         </div>
          <div class="swiper-slide li">
                <img src="/images/WMSC/b8db6d51049d4ad38e31161a3dc3d46d.jpg" alt="">
                <p>诛仙3-帽子</p>
                <span>￥232.00</span>
          </div>
          <div class="swiper-slide li">
                <img src="/images/WMSC/90018e2e-dd4b-4cb7-97f2-70ecc0774c00.jpg" alt="">
                <p>姜小虎货郎-小虎</p>
                <span>￥18.00</span>
          </div>
          <div class="swiper-slide li">
                <img src="/images/WMSC/635f53a079b842309405362282fe1b4d.jpg" alt="">
                <p>卡通副本-杯</p>
                <span>￥198.00</span>
          </div>
          <div class="swiper-slide li">
                <img src="/images/WMSC/82fba9e52ccc42a8aae507d656da2130.jpg" alt="">
                <p>战狼-运动衣衫</p>
                <span>￥599.00</span>
          </div>
          <div class="swiper-slide li">
                <img src="/images/WMSC/665c1d75873547f38e822c6ce669ff7c.jpg" alt="">
                <p>诛仙3-鼠标垫</p>
                <span>￥493.00</span>
            </div>
          <div class="swiper-slide li">
                <img src="/images/WMSC/c914900efe794fc6af1573dadf77339e.jpg" alt="">
                <p>黑衣-CSGO衣衫</p>
                <span>￥399.00</span>
          </div>
          <div class="swiper-slide li">
            <img src="/images/WMSC/a917a3be22b9471a83e34c58df61f375_120.jpg" alt="">
            <p>诛仙3-纯银镀金合欢铃</p>
            <span>￥239.00</span>
          </div>
          <div class="swiper-slide li">
            <img src="/images/WMSC/665c1d75873547f38e822c6ce669ff7c.jpg" alt="">
            <p>诛仙3-鼠标垫</p>
            <span>￥493.00</span>
          </div>
          <div class="swiper-slide li">
            <img src="/images/WMSC/635f53a079b842309405362282fe1b4d.jpg" alt="">
            <p>卡通副本-杯</p>
            <span>￥198.00</span>
          </div>
         </div>
        </div>
        <!-- Add Pagination -->
        <div class="swiper-pagination"></div>
        <!-- Add Arrows -->
        <div class="swiper-button-next"></div>
        <div class="swiper-button-prev"></div>
          </div>
        </div>
      </div>
     </div>

   <footer>

 </footer>

<script src="/lib/require/require.js" data-main="/js/cart"></script>

</body>

</html>